<%--
  author: winkyle
  date: 2018/11/27
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8"%>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html>
<html lang="en">
<head>
    <!-- jsp文件头和头部 -->
    <%@ include file="../../base/top.jsp"%>
    <style>
        #result_admin{
            width: 100%;
            padding: 5px;
            box-shadow: 0px 0px 3px #888888 ;
            border-radius: 5px;
            background-color: #FFFFFF;
        }
        .top{
            display: inline-block;
        }
        .opp{
            width: 195px;
            height: 210px;
            margin: 8px;
        }
    </style>
</head>
<body class="no-skin">
<!-- /section:basics/navbar.layout -->
<div class="main-container" id="main-container">
    <!-- /section:basics/sidebar -->
    <div class="main-content">
        <div class="main-content-inner">
            <div class="page-content">
                <div class="row">
                    <div class="col-xs-12">
                            <div style="width: 100%;text-align: right">
                            <a id="upload" class="btn btn-xs btn-primary" style="text-align: right" title="上传"><i
                                    class="ace-icon fa fa-cloud-upload"></i></a>
                            </div>
                            <table id="data-table" width="100%" class="table table-striped table-bordered">
                                <thead>
                                <tr>
                                    <th>
                                        <input type="checkbox" id="check-all"/>
                                    </th>
                                    <th>序号</th>
                                    <th>名称</th>
                                    <th>日期</th>
                                    <th>类型</th>
                                    <th>大小</th>
                                </tr>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                            <a class="btn btn-xs btn-primary"
                               id="load-all"
                               title="批量下载"><i
                                    class="ace-icon fa fa-download bigger-140"></i></a>
                            <a class="btn btn-xs btn-danger"
                               id="delete-all"
                               title="批量删除"><i
                                    class="ace-icon fa fa-trash-o"></i></a>
                    </div>
                    <!-- /.col -->
                </div>
                <!-- /.row -->
            </div>
            <!-- /.page-content -->
        </div>
    </div>

    <%--<a href="material/Android_v9.pdf" class="downloadable">2</a>--%>
    <!-- /.main-content -->
    <!-- 返回顶部 -->
    <a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
        <i class="ace-icon fa fa-angle-double-up icon-only bigger-110"></i>
    </a>
</div>


<form id="uploadForm">
    <input type="file" id="file" name="file"
           style="filter:alpha(opacity=0);opacity:0;width: 0;height: 0;"/>
</form>
<!-- /.main-container -->
<!-- basic scripts -->
<!-- 页面底部js¨ -->
<%@ include file="../../base/foot.jsp"%>
<script type="text/javascript">
    $(top.hangge());
    $("#upload").click(function () {
        //触发 文件选择的click事件
        $("#file").trigger("click");
    });
    $("#file").change(function () {
        var form = new FormData(document.getElementById("uploadForm"));
        form.append("teachCourseId",teachCourseId);
        $.ajax({
            url:"material/upload_course_material",
            type:"post",
            data:form,
            processData:false,
            contentType:false,
            success:function(data){
                if(data['success']){
                    prompt_alert('success',data.msg,2);
                    reloadDataTable();
                }else{
                    prompt_alert('error',data.msg,2);
                }
            }
        });
        }
    );
    $("#load-all").click(function () {
        var checked = getAllCheckedRowValue();
        if(checked==null||checked.length<=0){
            prompt_alert('warning','请至少选择一行',2);
        }else {
            for (var index = 0; index < checked.length; index++) {
                download(checked[index].courseMaterialName + checked[index].fileType, checked[index].courseMaterialAddress);
            }
        }
    });
    $("#delete-all").click(function () {
        var form = new FormData(document.getElementById("uploadForm"));
        var checked = getAllCheckedRowValue();
        if(checked==null||checked.length<=0){
            prompt_alert('warning','请至少选择一行',2);
        }else {
            var courseMaterialIds = new Array();
            for (var index = 0; index < checked.length; index++) {
                courseMaterialIds.push(checked[index].courseMaterialId);
            }
            bootbox.confirm({
                message: "是否同时删除文件：",
                backdrop: false,
                buttons: {
                    confirm: {
                        label:"是",
                        className: 'left btn-success'
                    },
                    cancel: {
                        label: "否",
                        className: 'right btn-danger'
                    }
                },
                callback: function (result) {
                    console.log(courseMaterialIds);
                    form.append("courseMaterialIds", courseMaterialIds);
                    form.append("teachCourseId", teachCourseId);
                    form.append("deleteFile", result);
                    $.ajax({
                        url: "material/drop_course_materials",
                        type: "post",
                        data: form,
                        processData: false,
                        contentType: false,
                        success: function (data) {
                            if (data['success']) {
                                prompt_alert('success', data.msg, 2);
                                reloadDataTable();
                            } else {
                                prompt_alert('error', data.msg, 2);
                            }
                        }
                    });


                }
            });
        }
    });

    var teachCourseId = "${teachCourseId}";
    var table = null;
    var url='material/search_course_material_files';
    var param = {teachCourseId:teachCourseId};
    var columnsData =  [
        {
            bSortable : false,
            className : "text-left",
            width : "50px",
            render : function(data, type, row, meta) {
                return "<input type=\"checkbox\"/>";
            }
        },
        {
            bSortable : false,
            data: null,
            width : "40px",
            className: 'text-center whiteSpace',
            render:function(data,type,row,meta) {
                return meta.row + 1 +
                    meta.settings._iDisplayStart;
            }
        },
        {'data': 'courseMaterialName'},
        {'data': 'teachCourseMaterialCreateTime'},
        {bSortable : false,'data': 'fileType'},
        {bSortable : false,'data': 'fileSize'}
    ];
    var dataBaseFiled =  [
        {'data': 'course_material_name'},
        {'data': 'teach_course_material_create_time'},
    ];
    $(document).ready(function() {
        table = $('#data-table').DataTable($.extend(true,{},CONSTANT.DATA_TABLES.DEFAULT_OPTION,{
            columns:columnsData,
            ajax: function (data,callback) {
                ajax(data,callback,dataBaseFiled,url,param);
            },
            order:[[ 2, "asc" ]]
        }));
    });
</script>

</body>
</html>